2장. 좋은 부탁이 좋은 결과를 만든다
출처: 『혼자 공부하는 바이브 코딩 with 클로드 코드』(조태호) | 예제 코드: github.com/taehojo/vibecoding
코드는 분위기만 — HTML, 섹션, CSS 같은 말은 몰라도 됩니다. 표의 '비유'와 '위험'만 봐도 충분해요.
0. 이 장의 새 단어 (0장에 없는 것만 3개)
0장 용어집에 이미 나온 말(프롬프트, PRD, 5W1H, 4단계 전략, 커스터마이즈)은 다시 풀지 않는다.
뒤에서 막히면 0장으로 돌아가면 된다.
이 장에서 처음 나오는 말은 딱 세 개다.
명확성·구체성·맥락 (좋은 프롬프트의 3가지 조건)
한 문장 뜻 — AI에게 부탁할 때 갖춰야 할 세 가지. 또렷하게(명확성), 자세하게(구체성), 왜 필요한지까지(맥락) 말하는 것.
일상비유 — 미용사에게 "예쁘게 잘라 주세요"가 아니라 "앞머리는 눈썹까지, 옆은 귀가 보이게, 면접 때문에 단정해 보이고 싶어요"라고 말하는 것.
한 줄 예 —
# 셋을 다 갖춰야 원하는 게 나온다
ai.ask("밝고 깔끔하게(명확), 시계+검색바 넣어(구체), 취업용이야(맥락)")
섹션·ID (구역과 이름표)
한 문장 뜻 — 웹페이지를 주제별 칸으로 나눈 것이 섹션, 그 칸마다 붙인 고유 이름표가 ID.
일상비유 — 책장을 '소설칸·요리칸·만화칸'으로 나누고(섹션), 각 칸에 이름표를 붙여 둔 것(ID). 이름표가 있으면 "요리칸만 정리해"가 된다.
한 줄 예 —
# 칸마다 이름표가 있으면 그 칸만 콕 집어 고친다
page = {"맨위메뉴": "...", "소개칸": "...", "연락처칸": "..."}
ai.ask("소개칸만 글자를 키워 줘")
레퍼런스 (참고용 본보기)
한 문장 뜻 — AI에게 "이런 느낌으로 해 줘"라고 건네는 참고 본보기. 디자인이나 기능의 예시다.
일상비유 — 미용실에 연예인 사진을 들고 가 "이 머리처럼 해 주세요"라고 보여 주는 것. 말로 설명하기 어려운 느낌을 사진 한 장이 대신한다.
한 줄 예 —
# 글로 설명하기 힘든 느낌은 본보기로 건넨다
ai.ask("이 워드프레스 테마처럼 깔끔한 디자인으로 바꿔 줘")
막히는 장면으로 들어가기
AI에게 "멋진 홈페이지 만들어 줘"라고 했는데, 내 마음과 영 딴판인 게 나온 적 있죠?
AI가 멍청해서가 아니다.
'멋지다'가 무슨 뜻인지 내가 안 알려 줬을 뿐이다.
같은 AI라도, 부탁을 어떻게 하느냐에 따라 결과가 하늘과 땅 차이가 난다.
그래서 부탁을 잘하는 것이 곧 실력이다.
이 부탁의 기술이 바로 이 장의 주제다.
이 장에서 딱 4가지만 (TL;DR)
- 좋은 부탁 = 명확성 + 구체성 + 맥락. 또렷하게, 자세하게, 왜 필요한지까지 말한다.
- 처음부터 완벽할 필요 없다. AI와 대화하며 조금씩 또렷하게 다듬어 간다.
- 5W1H로 PRD를 쓴다. 여섯 칸을 채우면 빠뜨린 게 없다. 템플릿에 끼워 넣기만 하면 된다.
- 한 번에 말고 4단계로. 뼈대 → 기능 → 디자인 → 점검 순서로 하나씩 시키고 확인한다.
개념 1 — 좋은 부탁의 세 가지 조건
막히는 장면
"멋진 나만의 시작 페이지 만들어 줘"라고 쳤더니, 어둡고 복잡한 페이지가 나왔다.
나는 밝고 단순한 걸 원했는데 말이다.
내가 '멋지다'의 뜻을 안 알려 줘서 AI가 자기 마음대로 정한 것이다.
일상비유 (택시 행선지)
택시에 타서 "좋은 데로 가 주세요"라고 하면 기사도 당황한다.
"서울역으로, 가장 빠른 길로, 지금 기차 시간이 급해서요"라고 해야 제대로 간다.
또렷한 행선지(명확), 자세한 조건(구체), 이유(맥락) — 이 셋이 좋은 부탁의 뼈대다.
| 비유 | 코드 | 위험 |
|---|---|---|
| "좋은 데로 가 주세요" | ai.ask("멋진 홈페이지 만들어 줘") |
AI가 제멋대로 만듦 |
| "서울역으로, 빠른 길로, 급해서요" | ai.ask("밝고 깔끔하게, 시계+검색바, 취업용이야") |
의도에 가까운 결과 |
한 문장 정의 — 좋은 프롬프트는 명확성(또렷하게)·구체성(자세하게)·맥락(왜 필요한지)을 모두 갖춘 부탁이다.
예시 폭격
예시 1 (완성예 — before/after).
# before — 모호한 부탁
ai.ask("멋진 홈페이지 만들어 줘")
# → '멋지다'를 AI가 임의로 해석, 엉뚱한 결과
# after — 세 조건을 갖춘 부탁
ai.ask("밝고 깔끔한 미니멀 스타일로(명확), 시계와 검색바를 넣고(구체), 내 취업용 포트폴리오야(맥락)")
# → 내 의도에 가까운 결과
예시 2 (부분완성 — 빈칸 채우기).
# 아래 빈칸을 세 조건에 맞게 채워 보자
ai.ask("____ 스타일로, ____ 기능을 넣고, ____ 용도야")
# 명확 구체 맥락
# 채운 예: "차분한 파란색 / 날씨와 뉴스 / 매일 아침 보는 시작 페이지"
예시 3 (독립적용 — 미니 시나리오).
친구가 "AI한테 카페 소개 페이지를 부탁했는데 이상하게 나와"라고 한다. 친구의 부탁은 "카페 페이지 만들어 줘"였다. 빠진 셋을 채워 주자: 명확("따뜻한 우드톤"), 구체("메뉴 사진과 지도"), 맥락("동네 주민에게 보여 줄 거야"). 이렇게 바꾸면 결과가 확 달라진다.
개념 2 — 처음부터 완벽할 필요 없다 (대화로 다듬기)
막히는 장면
"좋은 부탁을 하려니 한 번에 완벽한 문장을 써야 할 것 같아 부담스럽다"고 느낀 적 있죠?
그럴 필요 없다.
모호하게 시작해도, AI가 되묻는 질문에 답하다 보면 부탁이 저절로 또렷해진다.
일상비유 (옷 가게 점원)
옷 가게에서 "뭔가 단정한 옷 주세요"라고 하면, 점원이 되묻는다.
"어떤 자리에 입으실 건가요?", "색은 어두운 게 좋으세요?"
그 질문에 답하다 보면 내가 원하는 옷이 또렷해진다.
| 비유 | 코드 | 위험 |
|---|---|---|
| "단정한 옷 주세요" (모호한 시작) | ai.ask("시작 페이지 만들고 싶어") |
그대로 끝내면 두루뭉술 |
| 점원 질문에 답하며 좁히기 | AI 질문에 답하며 조건 추가 | 답을 대충 하면 다시 모호해짐 |
한 문장 정의 — 프롬프트는 한 번에 완성하지 않아도 되며, AI의 되묻는 질문에 답하는 과정 자체가 부탁을 다듬는 과정이다.
예시 폭격
예시 1 (완성예 — 대화 흐름).
# 1단계: 모호하게 시작
ai.ask("오늘 날씨와 뉴스를 보여 주는 시작 페이지를 만들고 싶어")
# 2단계: AI가 되묻는다
# "어떤 스타일을 원하세요?" "다른 기능도 넣을까요?" "뉴스는 어떤 종류로?"
# 3단계: 답하면서 또렷해진다
ai.ask("밝고 깔끔하게, 시계와 검색바도 넣어 줘, 기술 뉴스를 보여 줘")
예시 2 (부분완성 — AI 질문에 답해 보기).
# AI: "색상 톤은 어떻게 할까요?" → 내 답: "____"
# AI: "어떤 정보를 가장 위에 둘까요?" → 내 답: "____"
# 답을 채우면 다음 결과가 더 정확해진다
예시 3 (독립적용 — 미니 시나리오).
일기 쓰는 페이지를 만들고 싶은데, 어떻게 부탁할지 막막하다. 그냥 "일기 페이지 만들어 줘"로 시작하자. AI가 "날짜를 자동으로 넣을까요?", "지난 글 목록도 보일까요?"라고 물으면 하나씩 답한다. 세 번쯤 주고받으면 내가 원하던 페이지의 윤곽이 잡힌다.
개념 3 — 5W1H로 PRD 쓰기 (빠뜨림 없는 부탁)
막히는 장면
부탁을 또렷하게 하랬는데, 막상 적으려니 뭘 적어야 할지 머릿속이 하얘진 적 있죠?
이럴 때 쓰는 게 5W1H라는 여섯 칸 틀이다(0장 용어집 참고).
여섯 칸을 채우면 빠뜨린 게 없고, 그 채운 내용이 곧 PRD(제품 기획서)가 된다.
일상비유 (모임 공지)
친구들에게 모임을 알릴 때 빠뜨리면 안 되는 항목들이 있다.
왜 모이는지, 누가 오는지, 뭘 하는지, 언제·어디서·어떻게.
이 여섯 개를 다 적으면 "그래서 언제야?" 하는 되물음이 안 나온다.
| 비유 | 코드 | 위험 |
|---|---|---|
| 항목 빠진 모임 공지 | ai.ask("포트폴리오 만들어 줘") |
빠진 칸을 AI가 멋대로 채움 |
| 여섯 칸 다 채운 공지 | 5W1H를 채워 PRD로 전달 | 칸을 비워 두면 의도가 흐려짐 |
한 문장 정의 — 5W1H(왜·누가·무엇을·언제·어디서·어떻게)로 여섯 칸을 채우면 빠뜨림 없는 부탁이 되고, 그 결과물이 PRD다.
여섯 칸 빠르게 보기
왜(Why): 왜 만드는가? → 목적
누가(Who): 누구를 위한 것인가? → 대상
무엇(What): 무엇을 만드는가? → 기능
언제(When): 언제 쓰이는가? → 상황
어디서(Where):어디서 쓰이는가? → 환경
어떻게(How): 어떻게 만드는가? → 방법
소프트웨어에서는 '무엇(What)'과 '어떻게(How)'가 특히 중요하다.
예시 폭격
예시 1 (완성예 — 템플릿에 끼워 넣기).
# 빈칸에 5W1H 답만 끼워 넣으면 부탁이 완성된다
template = """
[무엇]을 만들려고 해.
주요 기능은 [구체적인 기능]이야.
[누구]를 위한 것이고,
[왜] 필요해.
어떻게 구현하면 좋을지 방향과 함께 PRD를 작성해 줘.
"""
예시 2 (부분완성 — 실제 답으로 채워 보기).
# 위 템플릿에 마케터 포트폴리오를 끼워 넣은 예
# 무엇 → "포트폴리오 웹페이지"
# 기능 → "채용 담당자가 30초 안에 역량을 파악할 구성"
# 누구 → "프리랜서 전환을 준비하는 마케터"
# 왜 → "____" ← 직접 채워 보자 (예: "경쟁력 있어 보이려고")
예시 3 (독립적용 — 미니 시나리오).
동네 빵집 사장님이 "주문받는 페이지를 부탁하고 싶다"고 한다. 여섯 칸을 같이 채워 주자. 왜(단골 주문을 편하게), 누가(동네 손님), 무엇(빵 목록과 주문 버튼), 언제(아침 영업 전), 어디서(휴대폰), 어떻게(간단하게). 이 여섯 줄을 템플릿에 넣으면 그대로 좋은 부탁이 된다.
개념 4 — 한 번에 말고 4단계로
막히는 장면
"이 기획서대로 웹페이지 통째로 만들어 줘"라고 한 번에 시켰더니, 코드가 뒤죽박죽 섞여 어디를 고쳐야 할지 막막한 적 있죠?
큰 일을 한 덩어리로 시키면 확인도 수정도 어렵다.
작게 쪼개 하나씩 시키고 확인하면 훨씬 안전하다.
이 쪼개는 순서가 4단계 전략이다(0장 용어집 참고): 뼈대 → 기능 → 디자인 → 점검.
일상비유 (집 짓기)
집을 지을 때 벽지부터 고르지 않는다.
설계도(뼈대) → 배관·전기(기능) → 인테리어(디자인) → 준공 검사(점검) 순서로 한 단계씩 끝내고 넘어간다.
| 비유 | 코드 | 위험 |
|---|---|---|
| 벽지부터 한 번에 | build("웹페이지 전부") |
뒤섞여 수정·확인 불가 |
| 설계도→인테리어 단계별 | build("뼈대") 후 build("기능") |
단계마다 검증 — 누락 줄어듦 |
한 문장 정의 — 큰 작업은 뼈대 → 기능 → 디자인 → 점검으로 쪼개, 각 단계마다 요청·생성·확인·수정을 반복하면 누락과 오류가 줄어든다.
네 단계 빠르게 보기
1단계 뼈대 — 전체 구조(섹션)만 잡는다. 칸마다 이름표(ID)를 붙인다.
2단계 기능 — 칸에 진짜 내용(글·숫자)을 채운다.
3단계 디자인 — 색·모양을 입힌다. 레퍼런스를 건네면 품질이 오른다.
4단계 점검 — 빠진 게 없는지 AI에게 검토(QA)를 맡긴다.
예시 폭격
예시 1 (완성예 — 1단계 뼈대, 이름표 붙이기).
# 칸마다 고유 이름표를 붙여 달라고 콕 집어 부탁한다
ai.ask("PRD를 기반으로 전체 구조만 짜 줘. 칸을 나누고, 칸마다 고유한 이름을 붙여 줘. 아직 내용은 비워 둬.")
# 결과 예: 맨위메뉴 / 소개칸 / 성과칸 / 사례칸 / 연락처칸 ...
# 이름표가 있으면 나중에 "소개칸만 고쳐 줘"가 된다
예시 2 (부분완성 — 3단계 디자인, 레퍼런스 건네기).
# 글로 설명하기 힘든 느낌은 본보기(레퍼런스)로 건넨다
ai.ask("____ 처럼 깔끔하게 디자인해 줘. 칸마다 색 톤을 달리해서 구분이 잘 되게.")
# 빈칸 예: "이 워드프레스 포트폴리오 테마"
예시 3 (독립적용 — 4단계 점검, QA 맡기기).
페이지를 다 만든 것 같은데 빠진 게 있을까 불안하다. 마지막에 AI에게 점검을 맡기자. "모든 부분이 PRD대로 만들어졌는지, 링크가 잘 작동하는지 검토해 줘." AI가 빠진 기능과 오류를 찾고 개선점까지 알려 준다. 그 개선점만 다시 고치면 완성이다.
미니 시나리오 — 처음부터 끝까지 한 번에
마케터 지망생이 취업용 포트폴리오 페이지를 만들고 싶다.
먼저 좋은 부탁의 세 조건을 챙긴다. "밝고 깔끔하게(명확), 30초 안에 역량이 보이게(구체), 채용 담당자에게 보여 줄 거야(맥락)."
다음 5W1H로 PRD를 쓴다. 왜·누가·무엇·언제·어디서·어떻게를 채워 템플릿에 끼운다.
그 PRD를 4단계로 쪼개 시킨다. 1단계 뼈대(칸과 이름표) → 2단계 기능(진짜 경력 내용) → 3단계 디자인(테마 레퍼런스) → 4단계 점검(QA).
한 번에 다 안 시키고, 단계마다 보고 고쳤기 때문에 빠진 게 거의 없다. 이게 이 장 전체의 한 흐름이다.
단순 규칙 (지금은 이것만)
지금은 두 줄짜리 규칙만 들고 가면 된다.
부탁은 명확·구체·맥락 세 가지로, 큰 일은 한 번에 말고 뼈대→기능→디자인→점검 네 단계로.
처음부터 완벽한 문장을 못 써도 괜찮다.
AI와 주고받으며 다듬으면 된다.
한 걸음 더 ▸ (지금 몰라도 됨)
"AI가 점검까지 해 주니, 내가 직접 결과를 안 봐도 되지 않나?"는 아니다.
AI의 점검은 큰 도움이 되지만, 마지막에 내 눈으로 한 번 보는 것이 바이브 코딩의 절반이다.
지금은 "또렷하게, 쪼개서, 확인하기" 규칙만 들고 가면 충분하다.
정리
부탁을 잘하면 같은 AI라도 결과가 확 좋아진다.
세 가지를 챙기고(명확·구체·맥락), 5W1H로 빠짐없이 적고, 큰 일은 네 단계로 쪼갠다.
처음부터 완벽하지 않아도, 대화로 다듬으면 된다.
다음 장 예고 — 지금까지는 웹 채팅으로 부탁했다. 다음 장에서는 클로드를 내 컴퓨터에 깔아, 파일까지 직접 만들게 한다. (지금 몰라도 됩니다 — 다음 장에서 천천히 풀려요.)
클릭하거나 Space를 눌러 뒤집기